import P1 from "@assets/products/p1.jpg";
import ImageWithError from "@page/common/comps/ImageWithError";
import "./style.scss";
import DangeTag from "@page/common/comps/DangeTag";
import ProtocolTag from "@page/common/comps/ProtocolTag";
import Filter from "@module/Filter";
import Uts from "@module/Uts";
import showLoginModal from "@root/P/pages/LoginModal/showLoginModal";

class GoodList extends React.Component {
    jump = (sn, suppId) => {
        window.open(`#detail?productId=${sn}&suppId=${suppId}`);
    };

    isSuppSelf(suppId){
        const isSuppSelf=Uts.getCookie('suppId')==suppId;
        return isSuppSelf;
    }

    render() {
        const { list } = this.props;
        return (
            <div className="rj_shop_goods-list rj-fade-in">
                {list.map((item, index) => {
                    return (
                        <div
                            onClick={this.jump.bind(this, item.sn, item.suppId)}
                            className="good_item"
                            key={Math.random().toString()}
                        >
                            <div className="good_wp zen_ps-re">
                                <ImageWithError
                                    src={item.photo}
                                    style={{ width: 224, height: 224 }}
                                />
                                <div className="good_bottom">
                                    <div className="good_main">
                                        <span>
                                            {!global.hasLogin&&!this.isSuppSelf( item.suppId)
                                                ?
                                                <span
                                                    onClick={(e)=>{
                                                        e.stopPropagation()
                                                        showLoginModal(false,true)
                                                    }}
                                                    className="zen_fs-18 zen_F5222D zen_ps-re zen_t-2">
                                                    {global.isSupp?"单位登录可见": "价格登录可见"}
                                                </span>
                                                :
                                                <span className="zen_fs-18 zen_F5222D zen_ps-re zen_t-2">
                                                     ￥{Filter.float(item.price, 2)}
                                                </span>
                                            }
                                            {item.negotiatedPrice && (
                                                <span className="zen_fs-12 zen_p-h-4 zen_p-v-2 zen_m-l-5 zen_bg-FF6D0B zen_FFFFFF zen_bdr-4">
                                                    协议价
                                                </span>
                                            )}
                                            {item.activityPrice && (
                                                <span className="zen_fs-12 zen_p-h-4 zen_p-v-2 zen_m-l-5 zen_bg-FF6D0B zen_FFFFFF zen_bdr-4">
                                                    限时折扣
                                                </span>
                                            )}
                                            {item.groupBuying && (
                                                <span className="zen_fs-12 zen_p-h-4 zen_p-v-2 zen_m-l-5 zen_bg-FF6D0B zen_FFFFFF zen_bdr-4">
                                                    团购
                                                </span>
                                            )}
                                        </span>
                                        <span className="good_sales">
                                            销量：<em>{item.saleAmount}</em>
                                        </span>
                                    </div>
                                    <div className="good_name">
                                        <span
                                            className="zen_m-r-5"
                                            dangerouslySetInnerHTML={{
                                                __html: item.name
                                            }}
                                        />
                                        <div className="zen_fs-14 zen_FFFFFF zen_ps-ab zen_b-50">
                                        {item.dangerousTag &&
                                            item.dangerousTag != "其他" &&
                                            item.dangerousTag !=
                                                "常规化学品" && (
                                                <DangeTag
                                                    dangerousTag={
                                                        item.dangerousTag
                                                    }
                                                />
                                            )}
                                        </div>
                                    </div>

                                    <div className="zen_ps-ab zen_b-20 ">
                                        <span
                                            className={Uts.sc(['good_company zen_fs-12 zen_969696 zen_gs-12 zen_l-h-16 zen_il-bl zen_elli',item.protocol == "1"?'zen_m-w-p70':''])}
                                            dangerouslySetInnerHTML={{
                                                __html: item.suppname
                                            }}
                                        />
                                        {item.protocol == "1" && (

                                            <ProtocolTag className="zen_fs-12 zen_bg-58d1bd zen_FFFFFF zen_p-v-2 zen_p-h-5 zen_bdr-3 zen_m-l-3" />
                                        )}
                                    </div>
                                </div>
                            </div>
                        </div>
                    );
                })}
            </div>
        );
    }
}

export default GoodList;
